<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>注册</title>
<link rel="stylesheet" href="../assets/css/bootstrap.css">
<link rel="stylesheet" href="../assets/css/font-awesome.css">
<style>
.wrapper {
	margin: 100px auto;
	width: 400px;
}

input.form-control {
	border-radius: 0px;
}

.btn {
	border-radius: 0px;
}

header h3 {
	background-color: #D83434;
	color: #fff;
	padding: 10px 6px;
	width: 80px;
	border-top-right-radius: 40px;
	border-bottom-right-radius: 40px;
}
form span.error{
	color:red;
}
#verifyCode{
width:160px;
display:inline;
}
</style>
</head>
<body>
	<div class="wrapper">
		<header>
			<h3>注册</h3>
		</header>
		<section>
			<form role="form" action="create.do" method="post" class="requrie-validator"
				novalidate="novalidate">
				<spring:hasBindErrors name="registerInfo">
					<div class="alert alert-danger alert-dismissible" role="alert">
						<button type="button" class="close" data-dismiss="alert">
							<span aria-hidden="true">&times;</span><span class="sr-only">Close</span>
						</button>
						<form:errors path="registerInfo.*" cssClass="invalid-errors" />
					</div>
				</spring:hasBindErrors>
				<div class="form-group">
					<label for="exampleInputEmail1"><i class="fa fa-envelope"></i>邮箱</label> <input type="email"
						class="form-control required" id="" name="email"
						placeholder="Enter email">
				</div>
				<div class="form-group">
					<label for="exampleInputPassword1"><i class="fa fa-lock"></i>密码</label> <input
						type="password" class="form-control required" name="password"
						placeholder="Password">
				</div>
				<div class="form-group">
					<label for="exampleInputPassword1"><i class="fa fa-lock"></i>确认密码</label> <input
						type="password" class="form-control" name="confirmPassword"
						 placeholder="必填">
				</div>
				<div class="form-group">
					<label for="exampleInputPassword1"><i class="fa fa-phone"></i>手机号</label> <input type="text"
						class="form-control" name="telphone">
				</div>
				<div class="form-group">
					<input type="text"
						class="form-control" name="verifyCode" id="verifyCode" autocomplete="off">
					<img src="${pageContext.servletContext.contextPath}/pass/getCode" style="cursor:pointer" onclick="this.src = '${pageContext.servletContext.contextPath }/pass/getCode?_=' + new Date().getTime()">
				</div>
				<button type="submit" id="subbtn" class="btn btn-default btn-primary">Submit</button>
			</form>
		</section>
		<footer>
			<small>*点击确定表示同意青春加网络协议</small>
		</footer>
	</div>
	<script src="../assets/js/jquery-1.8.3.js"></script>
	<script src="../assets/js/bootstrap.js"></script>
	<script src="../assets/js/jquery.validate.js"></script>
	<script src="../assets/js/messages_zh.js"></script>
	<script type="text/javascript">
		$(".requrie-validator").validate(
			{
				errorElement: "span",
				 messages: {
					 email: {
						 required: "邮箱不能为空",
						 email: "邮箱的格式不正确"
					 },
					 password: {
						 required: "密码不能为空"
					    }
				 }
			}
		);
		/* $("#subbtn").click(function(){
			$.post("create.json",$('.requrie-validator').serialize(),function(data){
				alert(data);
			});
		}); */
	</script>
</body>
</html>